<?php if (!defined('THINK_PATH')) exit(); /*a:2:{s:111:"D:\phpStudy2018\PHPTutorial\WWW\xbs22\supermarket\public/../application/index\view\safety_set\change_phone.html";i:1540209896;s:84:"D:\phpStudy2018\PHPTutorial\WWW\xbs22\supermarket\application\index\view\layout.html";i:1540197846;}*/ ?>
<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">
	<meta http-equiv="X-UA-Compatible" content="IE=edge">
	<title>超市 </title>
	<meta name="description" content="">
	<meta name="keywords" content="">
	<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
	<meta name="renderer" content="webkit">
	<meta http-equiv="Cache-Control" content="no-siteapp" />
	<link rel="icon" type="image/png" href="/static/images/favicon.png">
	<link href="/static/css/amazeui.min.css" rel="stylesheet" type="text/css" />
	<link href="/static/css/style.css" rel="stylesheet" type="text/css" />
	<script src="/static/js/jquery-1.10.2.min.js"></script>
	<script src="/static/js/time.js"></script>
	<script src="/static/js/popup.mini.js"></script>
	<link rel="stylesheet" href="/static/layui/css/layui.css" />
	<script src="/static/layui/layui.js"></script>
</head>
<body style="background: #f6f6f6;">

<header data-am-widget="header" class="am-header am-header-default sq-head ">
	<div class="am-header-left am-header-nav">
		<a href="javascript:history.back()" class="">
			<i class="am-icon-chevron-left"></i>
		</a>
	</div>
	<h1 class="am-header-title">
		<a>绑定新手机号</a>
	</h1>
</header>
<form action="" class="layui-form">
	<div style="height: 49px;"></div>
	<div class="pay-iphone">请填写新手机号并进行验证</div>
	<div class="pay-box">
		<input type="text"  name="phone" placeholder="请输入新手机号"/>
		<input type="button" id="phoneCode" value="获取验证码" class="pay-box-btn"/>
	</div>
	<input type="text" placeholder="请输入验证码" name="phoneCode" class="login-password"/>
	<div class="yzm" style="margin-top: 1.5rem;">
		<img style="height: 50px;margin-left: 20px;width: 150px;" id="code" src="<?php echo url('index/Reg/getCode'); ?>" alt="">
		<input type="text" style="width: 200px" name="captcha" class="reg-yzm" placeholder="输入验证码"/>
	</div>
	<button class="login-btn" lay-submit lay-filter="sure">确认</button>
</form>
<div class="bound-text">
	<h2>手机绑定规则</h2>
	<p>1.一个手机号码只可以绑定一个账户；</p>
	<p>2.如果无法绑定手机，请联系客服协助解决。</p>
</div>

<script>
    layui.use('form', function () {
        var form = layui.form;
        $('#code').click(function () {
            $(this).attr('src', $(this).attr('src') + '?' + Math.random());
        });
        $('#phoneCode').click(function () {
            captcha = $(this).parent().siblings('div').find('input').val();
            console.log(captcha);
            if (captcha.length < 3 || captcha.length > 3) {
                layer.msg('请填写正确的验证码', function () {
                });
                return;
            }
            phone = $(this).siblings('input').val();
            if (phone.length < 11 || phone.length > 11) {
                layer.msg('请填写正确的手机格式', function () {
                });
                return;
            }
            $.post("<?php echo url('index/Reg/phoneCode'); ?>", {captcha: captcha, phone: phone}, function (res) {
                if (res.code == 0) {
                    layer.msg(res.msg, {icon: 9}, function () {
                    });
                } else {
                    layer.msg(res.msg, {icon: 1}, function () {
                        a = setInterval(run, 1000);
                    });
                }
            });
        })
        num = 58;
        function run() {
            num--;
            $('#phoneCode').attr('value', num + '秒后重新获取');
            if (num == 0) {
                num = 58;
                $('#phoneCode').attr('value', '重新获取');
                clearInterval(a);
            }

        }
        form.on('submit(sure)', function(data){
            console.log(data.field);
            $.post("<?php echo url('index/SafetySet/editPhone'); ?>",data.field, function(res) {
                if (res.code==1){
                    layer.alert(res.msg, {icon: 1},function (){
                        location.href=("<?php echo url('index/My/index'); ?>");
                    });
                }else{
                    $('#code').click();
                    layer.msg(res.msg, {icon: 9},function () {
                    });
                }
			});
            return false;
        });
    });
</script>

<div style="height: 55px;"></div>
<div data-am-widget="navbar" class="am-navbar am-cf am-navbar-default sq-foot am-no-layout" id="">
	<ul class="am-navbar-nav am-cf am-avg-sm-5">
		<li>
			<a href="<?php echo url('index/Index/index'); ?>" class="<?php echo request()->controller()=='Index' ? 'curr':''; ?>">
				<span class="am-icon-home"></span>
				<span class="am-navbar-label">首页</span>
			</a>
		</li>
		<li>
			<a href="message.html" class="">
				<span class="am-icon-comments"></span>
				<span class="am-navbar-label">动态</span>
			</a>
		</li>
		<li>
			<a href="<?php echo url('index/ShopingCar/index'); ?>" class="<?php echo request()->controller()=='ShopingCar' ? 'curr':''; ?>">
				<span class="am-icon-shopping-cart"></span>
				<span class="am-navbar-label">购物车</span>
			</a>
		</li>
		<li>
			<a href="allorder.html" class="">
				<span class="am-icon-file-text"></span>
				<span class="am-navbar-label">订单</span>
			</a>
		</li>

		<li>
			<a href="<?php echo url('index/My/index'); ?>" class="<?php echo request()->controller()=='My' ? 'curr':''; ?>">
				<span class="am-icon-user"></span>
				<span class="am-navbar-label">我的</span>
			</a>
		</li>
	</ul>
</div>
<script src="/static/js/jquery.min.js"></script>
<script src="/static/js/amazeui.min.js"></script>
</body>
</html>